<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="../../lib/layui/css/layui.css">
    <link rel="stylesheet" href="../../css/oksub.css">
    <link rel="stylesheet" href="../../myicon/iconfont.css" type="text/css">
    <meta charset="utf-8">
    <title>警情办理跟踪</title>
</head>
<style>
    .list-con {
        padding: 0 10px 15px 10px;
        margin-bottom: 20px;
    }

    .list-con .layui-table td,
    .layui-table-view,
    .layui-table[lay-skin=line],
    .layui-table[lay-skin=row] {
        border: none;
    }

    .list-con .layui-table tbody {
        color: #777777;
    }

    .list-con .layui-table tbody tr:hover,
    .layui-table[lay-even] tr:nth-child(even) {
        background-color: rgb(226, 226, 226);
        color: black;
        font-weight: bold;
    }

    .layui-table tr {
        border-bottom: 1px #e2e2e2 solid;
    }

    .list-margin {
        margin-left: -30px;
    }

    .layui-table-tool-self {
        display: none;
    }

    .typeButton {
        height: 27px;
        vertical-align: middle;
        font-size: 13px;
        text-align: center;
        line-height: 27px;
    }

    .layui-btn-primary-inside {
        background-color: #1E9FFF;
        border: none;
        color: #FFF;
    }

    .layui-btn-normal-inside {
        background-color: #FFF;
        color: #1E9FFF;
        border: 1px solid #1E9FFF;
    }
</style>

<body>
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>警情办理跟踪</legend>
</fieldset>
<div class="layui-row">
    <form class="layui-form ok-form">
        <div class="layui-form-item" style="margin-left: 30px">
            <div id="changeType">
                <button type="button" class="typeButton layui-btn layui-btn-normal-inside layui-btn-radius"
                        selectType="-1">
                    <i class="iconfont icon-quanbu" style="font-size: 18px;padding-right:5px;"></i>
                    全部
                </button>
                <button type="button"
                        class="typeButton layui-btn layui-btn-primary layui-btn-primary-inside layui-btn-radius"
                        selectType="1">
                    <i class="iconfont icon-daishenhe" style="font-size: 18px;padding-right:5px;"></i>
                    待处理
                </button>
                <button type="button"
                        class="typeButton layui-btn layui-btn-primary layui-btn-primary-inside layui-btn-radius"
                        selectType="2">
                    <i class="iconfont icon-chulizhong" style="font-size: 18px;padding-right:5px;"></i>
                    处理中
                </button>
                <button type="button"
                        class="typeButton layui-btn layui-btn-primary layui-btn-primary-inside layui-btn-radius"
                        selectType="99">
                    <i class="iconfont icon-daishenpi" style="font-size: 18px;padding-right:5px;"></i>
                    待审批
                </button>
                <div id="selectForm" style="float: right; margin-right:50px;"
                     class="layui-btn layui-btn-normal layui-btn-radius">
                    <i class="layui-icon layui-icon-search"></i>
                </div>
                <div id="selectEmpty" style="float: right; margin-right:10px;"
                     class="layui-btn layui-btn-normal layui-btn-radius">
                    刷新
                </div>
            </div>
        </div>
    </form>
</div>
<!--数据表格-->
<div class="list-con">
    <table class="layui-hide" id="tableId" lay-filter="tableId"></table>
</div>
</body>
<script src="../../lib/layui/layui.js"></script>
<script src="../../js/jquery.min.js"></script>
<script src="../../js/application.js"></script>
<script>
    var selectType = "-1";
    layui.use(["table", 'laydate', 'okLayer'], function () {
        let $ = layui.jquery;
        let table = layui.table;
        let okLayer = layui.okLayer;
        var form = layui.form
            , laydate = layui.laydate;
        //日期
        laydate.render({
            elem: '#date'
        });
        laydate.render({
            elem: '#date1'
        });
        //警情办理跟踪列表页
        let articleTable = table.render({
            elem: "#tableId",
            url: mainUri+"/vCaseAskForList/selects",
            where: {procPoliceId: police.policeId,procTatus:-1},
            cols: [[
                {field: "processId", title: "指派编号", hide: true},
                {field: "caseId", title: "警情编号", width: 180},
                {field: "caseDescription", title: "警情描述", width: 600},
                {
                    field: "remind", title: "提醒", width: 130, templet: function (d) {
                        var returnStr = "";
                        if (d.urging) {
                            returnStr += '<button class="layui-btn layui-btn-xs layui-btn-radius layui-btn-warm" onclick="showUrging(\'' +
                                d.processId+"\',\'"+d.caseId
                                + '\')" id="showUrging">' + '催办' + '</button>';
                        }
                        if (d.back) {
                            returnStr += '<button class="layui-btn layui-btn-xs layui-btn-radius layui-btn-danger"  onclick="showBack(\'' +
                                d.processId+"\',\'"+d.caseId
                                + '\')" id="showBack">' + '回退' + '</button>';
                        }
                        return returnStr
                    }
                },
                {
                    field: "procLevel", title: "督办级别", width: 90, templet: function (d) {
                        if (d.procLevel == "一级") {
                            return "<div style='color:#d92d29;font-weight: bold;font-size:15px'>" + d.procLevel + "</div>"
                        } else if (d.procLevel == "二级") {
                            return "<div style='color:#f09614;font-weight: bold;font-size:15px'>" + d.procLevel + "</div>"
                        } else if (d.procLevel == "三级") {
                            return "<div style='color:#fae600;font-weight: bold;font-size:15px'>" + d.procLevel + "</div>"
                        } else{
                            return "<div style='color:#478f43;font-weight: bold;font-size:15px'>" + d.procLevel + "</div>"
                        }
                    }
                },
                {field: "procperiod", title: "处理时长(日)", width: 120},
                {field: "askFullName", title: "分派者", width: 100},
                {field: "askForTime", title: "分派时间", width: 160},
                {field: "processingNodes", title: "处理节点", width: 130,templet: function (d) {
                    if(d.back&&d.procTatus==1){
                        return "回退";
                    }else{
                        return d.staticName
                    }
                    }},
                {field: "nowState", title: "当前状态",templet: function (d) {
                        if(d.back&&d.procTatus==1){
                            return "回退("+d.conFullName+"("+d.conRoleName+")|"+d.conDepartmentName+")";
                        }else{
                            if(d.conProcPoliceId==""){
                                return d.staticName
                            }
                            return d.conFullName+"("+d.conRoleName+")|"+d.conDepartmentName;
                        }
                    }
                },
                {field: "procTatus", title: "警情状态", hide: true}
            ]],
            page: {
                layout: ['prev', 'page', 'next', 'skip', 'count'],
                groups: 3,
                limit: 15,
                theme: '#1E9FFF',
            },

        });
        //详细页跳转
        table.on('row(tableId)', function (obj) {
            var data = obj.data;
            var state = data.procTatus;
            var url = null;
            switch (state) {
                case 1:
                    if(data.back){//回退
                        url = "back.html?processid=" + data.processId;
                        url+="&caseid="+data.caseId;
                    }else{
                        url = "need.html?processid=" + data.processId;
                        url+="&caseid="+data.caseId;
                    }
                    break;
                case 2://处理中
                    url = "processing.html?processid=" + data.processId;
                    url+="&caseid="+data.caseId;
                    break;
                case 3://待审批
                    url = "checkPending.html?processid=" + data.processId;
                    url+="&caseid="+data.caseId;
                    break;
                case 4://待审核
                    url = "checkPending.html?processid=" + data.processId;
                    url+="&caseid="+data.caseId;
                    break;
            }
            show(url);
            obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
        });

        //搜索
        $("#selectForm").on('click', selectForm)
        function selectForm() {
            okLayer.open("查询条件", "selectForm.html", "35%", "60%", function (layero) {
                let iframeWin = window[layero.find("iframe")[0]["name"]];
                //iframeWin.initForm(initData.internshipId);
            }, function () {
                //根据子页面传过来的查询参数进行查询
                var caseId = window.document.caseId;
                var procLevel = window.document.procLevel;
                var caseDescription = window.document.caseDescription;
                var startTime = window.document.startTime;
                var endTime = window.document.endTime;
                var isChange=window.document.isChange;
                window.document.isChange=0
                if(isChange!=1){
                    return
                }
                articleTable.reload({
                    url: mainUri + "/vCaseAskForList/selects",
                    where: {
                        policeId: police.policeId,caseId: caseId, procLevel: procLevel, caseDescription: caseDescription,
                        startTime: startTime, endTime: endTime,procTatus:selectType
                    },
                })
            })
        }
        //刷新
        $("#selectEmpty").on('click',function(){
            articleTable.reload({
                where: {policeId: police.policeId,procTatus:selectType
                    ,caseId: "", procLevel: "", caseDescription: "",
                    startTime: "", endTime: ""},
            })
        })
         //全部按钮页
        $("#changeType button").on('click', function () {
            $("#changeType button").removeClass("layui-btn-normal-inside");
            $(this).addClass("layui-btn-normal-inside")
            selectType = $(this).attr("selectType");
            articleTable.reload({
                where: {policeId: police.policeId,procTatus:selectType
                    ,caseId: "", procLevel: "", caseDescription: "",
                    startTime: "", endTime: ""},
            });
        })
    })
    //跳转详细页
    function showUrging(processId,caseId) {
        var url = "urging.html?processid=" + processId;
        url+="&caseid="+caseId;
        show(url)
        event.stopPropagation();
    }
    //回退页
    function showBack(processId,caseId) {
        var url = "back.html?processid=" + processId;
        url+="&caseid="+caseId;
        show(url)
        event.stopPropagation();
    }
    //跳转详细页设置
    function show(url) {
        window.open(url, 'newwindow', 'width=' + (window.screen.availWidth - 10) + ',height=' + (window.screen.availHeight - 30) + ', top=0, left=0, toolbar=no, menubar=no, scrollbars=yes, resizable=yes,location=no, status=no')
    }

</script>
</html>